<template>
  <div>
    <div class="message">
      <div class="title">
        最近十次订购记录:
      </div>
      <lb-table
        ref="lbTable"
        highlight-current-row
        element-loading-text="加载中"
        :column="nearBy10tableData.column"
        border
        max-height="400"
        :data="nearBy10tableData.data"
        :pagination="false"
        :total="nearBy10tableData.total"
      />
      <div style="height: 40px;" />
      <div class="title">
        租瓶信息:
      </div>
      <lb-table
        ref="lbTable1"
        class="tableOrder"
        highlight-current-row
        element-loading-text="加载中"
        :column="leaseData.column"
        max-height="400"
        :data="leaseData.data"
        :pagination="false"
        :total="leaseData.total"
      />
    </div>
  </div>
</template>

<script>
  import { phoneOrderby3order, queryMap } from '@/api'
  export default {
    name: 'message',
    props: {
      // :open-flow="openFlow" :open-urge="openUrge" :open-back-order="openBackOrder"
      openFlow: {
        type: Function
      },
      openUrge: {
        type: Function
      },
      openBackOrder: {
        type: Function
      },
      parseTime: {
        type: Function
      }
    },
    data() {
      return {
        EnumList1: [], // 订单状态
        EnumList2: [], // 订单来源
        submit: {
          checkList: []
        },
        nearBy10tableData: {
          column: [
            { label: '订单编号', prop: 'orderCode', width: 65, align: 'center' },
            { label: '数量', prop: 'goodsCount', width: 35 },
            { label: '商品描述', prop: 'goodsDesc', width: 140 },
            { label: '下单时间', prop: 'transactTime', width: 105,
              render: (h, { row }) => <span >{row.transactTime && this.parseTime(row.transactTime, '{y}-{m}-{d} {h}:{i}:{s} ')}</span>
            },
            { label: '来源', prop: 'fromPlat', width: 100,
              render: (h, { row }) => <span >{this.EnumList2.find(l => l.value === row.fromPlat) ? this.EnumList2.find(l => l.value === row.fromPlat).desc : ''}</span>
            },
            { label: '状态', prop: 'orderStatus', align: 'center', width: 100,
              render: (h, { row }) => <span >{this.EnumList1.find(l => l.value === row.orderStatus) ? this.EnumList1.find(l => l.value === row.orderStatus).desc : ''}</span>
            },
            {
              prop: 'yf',
              label: '催单',
              align: 'center',

              render: (h, { row, $index }) => row.orderStatus === 7 ? <span>催单</span> : <span style='color:#126edc;cursor:pointer' onClick={() => this.openUrge({ billCode: row.orderCode, billType: 1 })} >催单</span>
            },
            {
              prop: 'fee1',
              label: '退单',
              align: 'center',

              render: (h, { row, $index }) => row.orderStatus === 7 ? <span>催单</span> : <span style='color:#126edc;cursor:pointer' onClick={() => this.openBackOrder(row)} >退单</span>
            },
            {
              prop: 'tip1',
              label: '流转',
              align: 'center',

              render: (h, { row, $index }) => <span style='color:#126edc;cursor:pointer' onClick={() => this.openFlow(row)} >流转</span>
            },
            { label: '客户地址', prop: 'csmAddress', width: 150 },
            { label: '所属机构', prop: 'orgName', width: 100 }

          ],
          data: []
        },
        leaseData: {
          column: [
            { label: '型号', prop: 'specName', width: 400, align: 'center' },
            { label: '数量', prop: 'goodsCount', width: 180, align: 'center' }
          ],
          data: []
        }
      }
    },

    async created() {
      await this.getEnum1()
      await this.getEnum2()
    },
    methods: {
      async getData(csmId) {
        this.$nextTick(async() => {
          if (!csmId) {
            return
          }
          const params = {
            csmId: csmId,
            topCount: 10
          }
          const res = await phoneOrderby3order(params)
          this.nearBy10tableData.data = res.data
        })
      },
      async getEnum1() {
        const res = await queryMap({ enumName: 'OrderStatus' })
        this.EnumList1 = res.data
        return 1
      },
      async getEnum2() {
        const res = await queryMap({ enumName: 'OrderSource' })
        this.EnumList2 = res.data
        return 2
      }
    }
  }
</script>

<style lang="scss" scoped>
.repairs {
  height: 100%;
}
.title {
  font-size: 14px;
  color: #ed912e;
}
</style>

